import React, { useState } from "react"
import styles from '../pages/index.less';
import'../pages/index.less';
import { NavLink } from "react-router-dom";
import wipilogo from "../../src/image/wipi-logo.png"
import Switchs from "../../src/components/Switch"
import useStore from '@/context/useStore'

const Headers: React.FC = () => {
  let { Home } = useStore()

  return (
    <header className={styles.header}>
      {/*头部*/}
      <div className={styles.Centerbox}>
        <div className={styles.image}>
          <img src={wipilogo} alt="" />
        </div>
        <ul>
          <li><NavLink to="/homepage">首页</NavLink></li>
          <li><NavLink to="/file">归档</NavLink></li>
          <li><NavLink to="/Knowledgenotes">知识笔记</NavLink></li>
          <li><NavLink to="/MessageBoard">留言板</NavLink></li>
          <li><NavLink to="/about">关于</NavLink></li>
          <li className={styles.Switch}><Switchs /></li>
          <li onClick={() => Home.setfalg()}><span className={styles.search}></span></li>
        </ul>
      </div>
    </header>
  )
}
export default Headers;